//顶部标题栏组件  在需要使用的页面 引用， 传入三个参数 名称 title  
//如果需要右边图标 传入对应的vant icon的图标名称，还有就是 需要跳转的地址 address ， 这边默认就是左边返回上一个页面 右边需要自己添加跳转的地址
//使用时 在使用页面进行引入 import navbar from "xxx/xxx/components/navbar.vue" 全局使用较多时 也可全局引入
<template>
	<div class="goods-list">
		<van-nav-bar :title='title' @click-left="goback()" @click-right='gowhere(address)'  fixed left-arrow>
		  <template #right>
		    <van-icon :name='icon' size="18" />
		  </template>
		</van-nav-bar>
	</div>	
</template>

<script>
	export default {
		name:"navbar",
	  props:{
		   title: String,
		  icon: String,
		  address: String,
	  },
	  methods: {
	      goback() {
	          this.$router.go(-1);
	  
	      },
		  gowhere(address){
			  this.$router.push({path:`/${address}`})
		  }
	     
	  },
	};
</script>

<style lang="scss" scoped>
	.goods-list{
		margin-bottom: 60px;
	}
	 /deep/ .van-ellipsis{
			color: #FFF !important;
		}
	/deep/ .van-nav-bar{
		background-color: #FF854D;
		
	}
	/deep/ .van-nav-bar .van-nav-bar__title{
		color: #fff;
	}
	/deep/ .van-nav-bar .van-icon{
		color: #fff;
	}
</style>
